
import React, { Component } from "react"
import { Layout,Breadcrumb,Modal} from "antd"
import Head from "./head"
import SildeMenu from "./menu"
import Foot from "./foot"
import "./index.scss"
import {axios} from "&/axios"
import {ExclamationCircleOutlined} from '@ant-design/icons'
import {Switch,Route,Redirect} from "react-router-dom";
import Home from "../home"
import UserList from "../usermanage/list"
// import UserChange from "../usermanage/change"
import usermobx from "*/mobx/user"
import {observer} from "mobx-react"
import Life from "../life";
import Mine from "../mine"
import Buy from "../shopping/buy"
import Mycart from "../shopping/mycart"
import GoodsDetail from "../shopping/goodsdetail"
import Paynow from "../shopping/paynow"
import AdviseList from "../advise/list"
import AdviseCreate from "../advise/create"
import AdviseUpdate from "../advise/update"
import Preview from "../advise/preview"
const {Content}=Layout;

@observer
 class Main extends Component {
     state={
         names:[]
     }
    componentDidMount(){
        var token=sessionStorage.token;
        if(!token){
            Modal.confirm({
                title:"提示",
                content:"你暂未登录,请先去登录",
                icon: <ExclamationCircleOutlined />,
                onOk:()=>{
                    this.props.history.push("/login")
                },
                oncancel:()=>{
                    this.props.history.push("/login")
                }
            })
        }else{
            if(!usermobx.userinfo){

                axios.post("/api/getuserinfo")
                .then(res=>{
                    if(res.data.type){
                        usermobx.getuserinfo(res.data.result)
                    }else{
                        this.props.history.push("/login")
                    }
                })
            }
        }
        var{
            location,
            match
        } = this.props;
        var names=location.pathname.split("/");
        this.setState({
            names
        })
    }
    render() {
        return (
            <Layout style={{width:'100%',height:'100%',display:'flex',flexDirection:'column'}}>
                <Head />
                <Layout style={{flex:1}}>
                    <SildeMenu />
                    <Layout style={{ padding: '0 24px 24px' }}>
                        <Breadcrumb style={{ margin: '16px 0' }}>
                            {
                                this.state.names.map((item,i)=>(

                                   i!=0&& <Breadcrumb.Item key={i}>{item}</Breadcrumb.Item>
                                ))
                            }
                        </Breadcrumb>
                        <Content
                            className="site-layout-background"
                            style={{
                                padding: 24,
                                margin: 0,
                                minHeight: 280,
                            }}
                        >
                            <Switch>
                                <Route path="/main/home" component={Home}/>
                                <Route path="/main/users" render={()=>(
                                    <Switch>
                                        <Route
                                        path="/main/users/list" component={UserList}
                                        />
                                        {/* <Route
                                        path="/main/users/action" component={UserChange}
                                        /> */}

                                    </Switch>
                                )}/>
                                <Route path="/main/life" component={Life}/>
                                <Route path="/main/mine" component={Mine}/>
                                <Route path="/main/shopping" render={()=>(
                                    <Switch>
                                        <Route path="/main/shopping/buy" component={Buy}/>
                                        <Route path="/main/shopping/goodsdetail/:goodId" component={GoodsDetail}/>
                                        <Route path="/main/shopping/paynow" component={Paynow}/>
                                        <Route path="/main/shopping/my" component={Mycart}/>
                                    </Switch>
                                )}/>
                                <Route path="/main/advise" render={()=>(
                                     <Switch>
                                         <Route path="/main/advise/list" component={AdviseList} />
                                         <Route path="/main/advise/create" component={AdviseCreate} />
                                         <Route path="/main/advise/update/:id?" component={AdviseUpdate} />
                                         <Route path="/main/advise/preview/:id?" component={Preview} />
                                    </Switch>
                                )}/>
                                <Route render={()=><Redirect to="/main/home"/>}/>
                            </Switch>
                        </Content>
                    </Layout>
                </Layout>
                        <Foot/>
            </Layout>
        )
    }
}
export default Main